<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="../node_modules/bootstrap/dist/css/bootstrap.css">

    <title>Document</title>
    <style>
        body {
            background: #fff;
        }
    </style>
</head>

<body>
    <div class="container-fluid">
        <div class="row-fluid">
            <div class="widget-box">
                <div class="widget-title">
                    <h5>商品信息表</h5>
                </div>
                <div class="widget-content nopadding">
                    <table class="table table-bordered table-striped">
                        <thead>
                            <tr>
                                <th>商品编号</th>
                                <th>商品名称</th>
                                <th>商品价格</th>
                                <th>商品的库存量</th>
                                <th>图片路径</th>
                                <th>操作</th>
                            </tr>
                        </thead>
                        <tbody>
                        </tbody>
                    </table>
                </div>
            </div>
</body>
<script src="../node_modules/jquery/dist/jquery.js"></script>
<script>
    $(() => {
        $.ajax({
            type: "get",
            url: "/goods/all",
            dataType: "json",
            success: response => {
                let list = response.list;
                let html = list.map((item) => {
                    return ` <tr>
                        <td>${item.good_id}</td>
                        <td>${item.name}</td>
                        <td>12000</td>
                        <td>30</td>
                        <td>${item.src}</td>
                        <td>
                        <button type="button" class="btn btn-danger">删除</button>
                        </td>
                       </tr>`
                });
                $("tbody").append(html);
                $(".btn-danger").click(function() {

                    $.ajax({
                        type: "delete",
                        url: "/admin/delgoods",
                        data: {
                            good_id: $(this).parents("tr").children().eq(0).text() * 1
                        },
                        dataType: "json",
                        success: response => {
                            if (response.msg == "删除成功") {
                                $(this).parents("tr").remove();
                            }
                        }
                    });
                })
            }
        });
    })
</script>

</html>